.el-date-editor {
  .el-input__prefix,
  .el-input__suffix-inner {
    color: #444;
  }
  .el-range-separator {
    width: initial;
    color: @color-sup;
  }
  &.el-input__inner:hover {
    border-color: @color-primary;
  }
  &.db-date-picker {
    border-color: #e5e5e5 !important;
    border-radius: 2px !important;
    padding: 1px 10px !important;
    height: auto !important;
    &.is-disabled {
      background-color: #f2f2f2 !important;
      input {
        background-color: #f2f2f2 !important;
      }
    }
  }
  &.el-input--medium {
    .el-input__icon {
      line-height: 32px !important;
      color: #c0c4cc !important;
    }
  }
}

.el-range-editor--medium.el-input__inner {
  border-radius: 2px;
}
.el-picker-panel {
  &.el-popper[x-placement^="bottom"] {
    margin-top: 4px;
  }
  .el-date-picker__header {
    margin: 0;
    padding: 4px 18px;
    border-bottom: 1px solid #f0f0f0;
    &-label {
      font-size: @font-content;
      font-weight: 500;
      color: @color-normal;
    }
    &--bordered + .el-picker-panel__content {
      overflow: hidden;
    }
  }
  .el-date-range-picker {
    &__content {
      padding: 0;
      &.is-left {
        border-right: 0;
      }
      .el-date-table {
        padding: 15px;
      }
    }
    &__header {
      padding: 0 18px;
      height: 40px;
      line-height: 40px;
      border-bottom: 1px solid #f0f0f0;
      .el-picker-panel__icon-btn {
        margin-top: 13px;
      }
    }
  }
  table {
    tr:nth-child(2n),
    tr:hover {
      background: #fff;
    }
  }

  .today-border() {
    content: "";
    position: absolute;
    border: 1px solid @color-primary;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    border-radius: 3px;
  }

  .el-month-table,
  .el-year-table {
    tr td {
      .cell {
        position: relative;
        color: @color-summary;
      }
      &.current:not(.disabled) a {
        border-radius: 2px;
        font-weight: 500;
        color: #fff;
        background: @color-primary;
      }
      &.today a {
        font-weight: 500;
        &::after {
          .today-border();
        }
      }
      &:hover a,
      & a:hover {
        color: @color-summary;
        background: rgba(82, 176, 254, 0.1);
        border-radius: 2px;
      }
    }
  }
  .el-date-table {
    color: @color-summary;
    tr {
      th {
        padding: 0;
        font-size: @font-content;
        font-weight: 500;
        color: @color-normal;
        border-bottom: none;
      }
      td {
        height: 24px;
        & > div {
          height: 24px;
          padding: 0;
        }
        &.current:not(.disabled) span {
          border-radius: 2px;
          font-weight: 500;
        }
        &.today span {
          font-weight: 500;
          &::after {
            .today-border();
          }
        }
        &.available:hover span {
          background: rgba(82, 176, 254, 0.1);
          border-radius: 2px;
          color: @color-summary;
        }
        &.in-range {
          div {
            background: rgba(82, 176, 254, 0.1);
          }
          &:first-of-type,
          &.start-date {
            div {
              margin-left: calc(50% - 12px);
            }
          }
          &:last-of-type,
          &.end-date {
            div {
              margin-right: calc(50% - 12px);
            }
          }

          &.start-date,
          &.end-date {
            * {
              border-radius: 2px;
            }
          }
        }
      }
    }
  }
}

.common-cover-min-time-picker {
  .el-time-spinner {
    text-align: center;
    .el-time-spinner__wrapper:not(:first-child) {
      display: none;
    }
  }
  .el-picker-panel__footer {
    .el-picker-panel__link-btn:first-child {
      display: none;
    }
  }
}

.common-cover-middle-time-picker {
  .el-time-spinner {
    text-align: center;
    .el-time-spinner__wrapper:last-child {
      display: none;
    }
  }
  .el-picker-panel__footer {
    .el-picker-panel__link-btn:first-child {
      display: none;
    }
  }
}

.common-fix-button-position-time-picker {
  .el-time-panel__footer {
    line-height: 10px;
  }
}
